<!--
<template>
  <div class="discountDetail">
    <head-nav></head-nav>
    <div class="zanwei-top"></div>
    <div class="discountDetailTop">
      <div class="cardImg">
        <img src="@/assets/img/vip.png" alt="">
        <p>乐宾百货 预售卡(1800元)</p>
        <p>会员:mm7832666</p>
        <p>恭喜您兑换成功!</p>
      </div>
    </div>
    <div class="discountDetailBottom">
      <div class="qrcode" id="qrcode">
        &lt;!&ndash;<img/>&ndash;&gt;
      </div>
      <p>验证码已经生成，请凭验证码及有效证件至五楼贵宾厅兑换领取。</p>
    </div>
  </div>
</template>

<script>
  export default {
    name: "DiscountDetail",
    data() {
      return {}
    },
    components: {},
    methods: {

    },
    created() {

    },
    mounted() {
      // this.$store.commit('TITLE','活动券')
      let qrcode = new QRCode(document.getElementById("qrcode"), {
        text: "http://jindo.dev.naver.com/collie",
        width: 156,
        height: 156,
        colorDark : "#000000",
        colorLight : "#ffffff"
      });
    }
  }
</script>

<style scoped lang="less">
  .discountDetail {
    /*padding: .3rem .4rem;*/
    margin: 0.3rem 0 0.9rem 0;
    > .discountDetailTop {
      padding: .2rem;
      border-bottom: dashed #eebb61;
      text-align: center;
      p {
        font-size: 13pt;
      }
      :nth-child(2) {
        line-height: 1rem;
        color: #888;
        font-size: 15pt;
      }
      :nth-child(4) {
        color: #eebb61;
      }
      .cardImg {
        img {
          margin: 0 auto;
          width: 70%;
        }
      }
    }
    > .discountDetailBottom {
      display: flex;
      flex-direction: column;
      align-items: center;
      .qrcode {
        width: 2.8rem;
        height: 2.8rem;
        border: #cbcbcc solid 1px;
        margin-top: 0.3rem;
        margin-bottom: 0.3rem;
        img {
          width: 100%;
          height: 100%;
        }
      }
      p {
        width: 4.56rem;
        font-size: 0.24rem;
        color: #000000;
        text-align: center;
      }
    }
  }


</style>
-->
